<template>
  <TopNav title="订餐记录"/>
  <div className="container">
    <!--列表 start-->
    <div class="record-list" v-for="(item,index) in dataList.list" :key="index">
      <el-card class="record-item">
        <p><span>订餐时间:</span>{{ detaFormater(Number(item.orderTime)) }}</p>
        <p><span>餐型:</span>{{ item.mealType }}</p>
        <p><span>患者:</span>
          <spa v-for="item2 in patientList.list" :key="item2.patientId">
            {{ item.patientId == item2.patientId ? item2.patientName : '' }}
          </spa>
        </p>
        <p><span>餐食:</span>
          <spa v-for="item2 in mealList.list" :key="item2.mealId">
            {{ item.mealId == item2.mealId ? item2.mealName : '' }}
          </spa>
        </p>
      </el-card>
    </div>
    <!--列表 end-->
  </div>
</template>

<script setup>
import {useDataStore} from "@/stores/dataStore.js";
import {useRoute, useRouter} from 'vue-router'
import TopNav from "@/components/TopNav/Back.vue"
import mealAxios from "@/api/meal.js"
import patientAxios from "@/api/patient.js"
import {onMounted, reactive, ref} from "vue";
import {detaFormater} from "@/utils/utils.js"

const route = useRoute()
//route.params.name;
const router = useRouter()
const dataStore = useDataStore()
//初始化分页查询数据
const dataList = reactive({
  list: []
})
const patientList = reactive({
  list: []
})
const mealList = reactive({
  list: []
})
//初始化总条数
const totalData = ref(0)
//当前页
const currentPage = ref(1)
//初始化分页显示条数
const defaultPageSize = ref(10)
//搜索初始化状态
const searchInfo = ref("")
//添加添加对话框控制器
const dialogAddVisible = ref(false)
//初始化添加对话框状态
const addFormInfo = reactive({
  orderTime: "",
  patientId: "",
  mealId: "",
  mealType: "",
})
//编辑对话框控制器
const dialogEditorVisible = ref(false)
//初始化编辑对话框状态
const editorFormInfo = reactive({
  mealRecordId: '',
  orderTime: "",
  patientId: "",
  mealId: "",
  mealType: "",
})
/**
 * 网路请求：分页查询
 *  */
const http = () => {
  mealAxios.mealRecord_search({
    search: searchInfo.value,
    page: currentPage.value,
    size: defaultPageSize.value
  }).then(res => {
    if (res.data.code == 200) {
      dataList.list = res.data.data.records
      totalData.value = res.data.data.total
    } else {
      ElMessage.error(res.data.message)
    }

  })
}
onMounted(() => {
  http()
  patientAxios.patient_findAll().then(res => {
    if (res.data.code == 200) {
      patientList.list = res.data.data
    }
  })
  mealAxios.meal_findAll().then(res => {
    if (res.data.code == 200) {
      mealList.list = res.data.data
    }
  })
})
/**
 * 分页
 */
const currentChangeHaddler = (nowPage) => {
  currentPage.value = nowPage
  http()
}
/**
 * 搜索按钮
 */
const searchHandle = () => {
  http()
}
/**
 * 添加对话框弹出事件
 */
const addHander = () => {
  dialogAddVisible.value = true
}
/**
 * 添加对话框 确定事件
 */
const sureHandler = () => {
  mealAxios.mealRecord_add({
    orderTime: addFormInfo.orderTime,
    patientId: addFormInfo.patientId,
    mealId: addFormInfo.mealId,
    mealType: addFormInfo.mealType,
  }).then(res => {
    if (res.data.code == 200) {
      dialogAddVisible.value = false
      http()
    } else {
      ElMessage.error(res.data.message)
    }
  })
}
/**
 * 编辑对话框 弹出事件
 *  */
const handleEdit = (index, row) => {
  dialogEditorVisible.value = true
  mealAxios.mealRecord_findById({
    mealRecordId: row.mealRecordId
  }).then(res => {
    if (res.data.code == 200) {
      editorFormInfo.mealRecordId = res.data.data.mealRecordId;
      editorFormInfo.orderTime = res.data.data.orderTime;
      editorFormInfo.patientId = res.data.data.patientId;
      editorFormInfo.mealId = res.data.data.mealId;
      editorFormInfo.mealType = res.data.data.mealType;
    } else {
      ElMessage.error(res.data.data.message)
    }
  })

}
/**
 * 编辑对话框 确定事件
 */
const sureEditorHandler = () => {
  mealAxios.mealRecord_update({
    mealRecordId: editorFormInfo.mealRecordId,
    orderTime: editorFormInfo.orderTime,
    patientId: editorFormInfo.patientId,
    mealId: editorFormInfo.mealId,
    mealType: editorFormInfo.mealType,
  }).then(res => {
    if (res.data.code == 200) {
      dialogEditorVisible.value = false
      http()
    } else {
      ElMessage.error(res.data.message)
    }
  })
}
/**删除 */
const handleDelete = (index, row) => {
  ElMessageBox.confirm(
      '确定删除么',
      '删除',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }
  ).then(() => {
    mealAxios.mealRecord_delete({
      mealRecordId: row.mealRecordId
    }).then(res => {
      if (res.data.code == 200) {
        ElMessage({
          type: 'success',
          message: "删除成功！！！",
        })
        http()
      } else {
        ElMessage({
          type: 'error',
          message: res.data.message,
        })
      }
    })
  }).catch(error => {
    ElMessage({
      type: 'info',
      message: "取消删除",
    })
  })
}

</script>

<style scoped lang="scss">
.record-list {
  .record-item {

    p {
      margin-top: 10px;
      opacity: .8;

      span {
        font-size: 16px;
        margin-right: 10px;
        font-weight: bolder;
      }
    }
  }
}
</style>
